import React ,{ Component } from 'react';
import { Breadcrumb } from 'antd';
import { Link } from 'react-router-dom';
import breadcrumbNameMap from './config.js';

export default class CustomBreadcrumb extends Component {

  getBreadcrumbItems = () => {
    const { pathname } = this.props;
    const pathSnippets = pathname.split('/').filter(i => i);
    const length = pathSnippets.length - 1;
    return pathSnippets.map((item, index) => {
      const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
      return (
        <Breadcrumb.Item key={url}>
          {index !== length ? (
            <Link to={url}>
              {breadcrumbNameMap[url]}
            </Link>
          ) : (
            breadcrumbNameMap[url]
          )}
        </Breadcrumb.Item>
      );
    });
  }

  render() {
    return (
      <Breadcrumb {...this.props}>
        {this.getBreadcrumbItems()}
      </Breadcrumb>
    );
  }
}
